<template>
  <div class="right-body">
    <img style="width: 100%;margin: 30px 0px;" src="../../assets/header_logo.png" />
    <em
      >一期：北京市昌平区中关村生命科学园科学园路26号院北京脑科学与类脑研究所</em
    >
    <em
      >二期（主要办公地）：北京市昌平区中关村生命科学园医科路9号院3号楼北京脑科学与类脑研究所</em
    >
    <em class="zip-code">邮编：102206</em>
    <div class="right-a">
      <a
        v-for="(item, idnex) in img_list"
        :key="idnex"
        :href="item.url"
        @mouseenter="item.flag = true"
        @mouseleave="item.flag = false"
        ><img :src="item.flag ? item.active : item.unactive"
      /></a>
    </div>
  </div>
</template>
<script>
export default {
  name: "FooterTopRight",
  data: function () {
    return {
      img_list: [
        {
          active: require("../../assets/wechat-active.png"),
          unactive: require("../../assets/wechat-unactive.png"),
          url: "#",
          flag: false,
        },
        {
          active: require("../../assets/phone-active.png"),
          unactive: require("../../assets/phone-unactive.png"),
          url: "#",
          flag: false,
        },
      ],
    };
  },
};
</script>

<style>
.right-body {
  flex: 8;
  margin-left: 10px;
  display: flex;
  flex-direction: column;
}
.zip-code {
  margin: 20px 0px;
}
.right-body em {
  font-size: 12px;
}
.right-a {
  display: flex;
  flex-direction: row;
}
.right-a a{
  margin-right: 15px;
}
.right-a img {
  height: 40px;
}
</style>